<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>合伙店铺管理</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
		<link rel="stylesheet" href="../../layuiadmin/style/public.css" media="all">
	</head>
	<body>
		<div class="layui-fluid" id="LAY-component-grid-list">
			<div class="layui-card">
				<div class="layui-card-body">
					<!-- 搜索条件start -->
					<form class="layui-form meberMangement" action="">
						<div class="layui-row demo-list">
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">合伙店铺ID</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="精确搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">店铺名称</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">机构名称</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">机构编号</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">合伙人手机号</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="搜索微信绑定手机号/其他注册手机号" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">合伙人会员ID</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="精确搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">机构类型</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">店铺状态</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">收货人</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">收货人联系方式：</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="搜索微信绑定手机号/其他注册手机号" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm6 layui-col-md6 layui-col-lg12" style="justify-content: flex-end;display: flex;">
								<div class="layui-btn-container">
									<button type="button" class="layui-btn">清空搜索</button>
									<button type="button" class="layui-btn">导出</button>
									<button type="button" class="layui-btn" style="margin-right: 0;">搜索</button>
								</div>
							</div>
						</div>
					</form>
					<!-- 搜索条件end -->
					<!-- tab标签start -->
					<div class="layui-tab custom-tab">
						<div class="layui-tab-content" style="padding: 0;">
							<div class="layui-tab-item layui-show">
								<!-- 合伙机构管理start -->
								<div class="layui-table-meber">
									<table id="allMember" lay-filter="allMember" class="layui-table" lay-skin="nob"></table>
								</div>
								<!-- 合伙机构管理end -->

								<!-- 店铺信息start -->
								<script type="text/html" id="webchatMsg">
									<div>
										<div class="meberId">合伙店铺ID：PS10000008</div>
										<div class="list-data">
											<p>店铺名称：</p>
											<p>店铺二维码：<a href="#" class="see-btn">点击查看</a></p>
											<p>主图:<a href="#" class="see-btn">点击查看</a></p>
											<p>专家名字:</p>
											<p>专家职称：</p>
											<p>联系方式：</p>
											<p>擅长项目：</p>
											<p>微信号：</p>
											<p>微信二维码：<a href="#" class="see-btn">点击查看</a></p>
										</div>
									  </div>
								</script>
								<!-- 店铺信息end -->
								<!-- 店铺收货信息start -->
								<script type="text/html" id="memberMsg">
									<div>
										<div class="meberId"></div>
										<div class="list-data">
											<p>会员名:</p>
											<p>昵称:</p>
											<p>性别:</p>
											<p>微信号:</p>
										</div>
									  </div>
								</script>
								<!-- 店铺收货信息end -->
								<!-- 机构/合伙人start -->
								<script type="text/html" id="registerMsg">
									<div class="table-barDemo">
									<div class="meberId"></div>
									<div class="list-data">
										<p>机构名称：</p>
										<p>机构编号：</p>
										<p>机构类型：村医</p>
										<p>机构地址：</p>
										<p>合伙人会员ID：M1000010000</p>
										<p>合伙人openid：</p>
										<p>合伙人unionid：</p>
										<p>合伙人微信绑定手机号：</p>
										<p>合伙人其他注册手机号：</p>
									</div>
								  </div>
								</script>
								<!-- 机构/合伙人end -->
								<!-- 状态信息start -->
								<script type="text/html" id="roleMsg">
									<div class="table-barDemo">
									<div class="meberId"></div>
									<div class="list-data">
										<p>店铺状态：待生效</p>
										<p>创建时间：精确到秒</p>
									</div>
								  </div>
								</script>
								<!-- 状态信息end -->
								<!-- 操作start -->
								<script type="text/html" id="memberMsgOperate">
									<div class="table-barDemo">
									<div class="meberId"></div>
									  <a class="layui-btn layui-btn-sm" lay-event="log">日志</a>
									  <a class="layui-btn layui-btn-sm" lay-event="effect">立即生效</a>
									  <a class="layui-btn layui-btn-sm" lay-event="stopUse">立即停用</a>
									  <a class="layui-btn layui-btn-sm" lay-event="improve">完善店铺信息</a>
									  <a class="layui-btn layui-btn-sm" lay-event="edit">修改店铺信息</a>
								  </div>
								</script>
								<!-- 操作end -->
							</div>
						</div>
					</div>
					<!-- tab标签end -->
				</div>
			</div>
		</div>
		<!-- 日志start -->
		<div class="log-box" id="log-box">
			<div class="layui-card">
				<div class="layui-card-body">
					<form class="layui-form" action="">
						<div class="layui-row demo-list">
							<div class="layui-col-sm4 layui-col-md4 layui-col-lg4">
								<div class="layui-form-item">
									<label class="layui-form-label">日期</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" id="test1" placeholder="请选择">
									</div>
								</div>
							</div>
							<div class="layui-col-sm4 layui-col-md4 layui-col-lg4">
								<div class="layui-form-item">
									<label class="layui-form-label">操作人</label>
									<div class="layui-input-block">
										<select>
											<option value="">请选择</option>
											<option value="1">1</option>
											<option value="2">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm4 layui-col-md4 layui-col-lg4" style="justify-content: flex-end;display: flex;">
								<div class="layui-btn-container">
									<button type="button" class="layui-btn">搜索</button>
									<button type="button" class="layui-btn">清空搜索</button>
								</div>
							</div>
						</div>
					</form>

					<table id="logTable" lay-filter="logTable" class="layui-table"></table>
				</div>
			</div>
		</div>
		<!-- 完善与修改店铺信息start -->
		<div class="edit-box" id="edit-box">
			<div class="layui-card">
				<div class="layui-card-body">
					<form class="layui-form" action="">
						<div class="layui-row demo-list">
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item" style="font-weight:bold;">
									<label class="layui-form-label" style="font-weight:bold;">合伙店铺ID</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" value="PS1000010000" readonly="true" style="border: none;">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">店铺名称</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入店铺名称">
									</div>
								</div>
							</div>
							<div class="site-title">
								<fieldset>
									<legend><a name="blockquote">店铺收货信息</a></legend>
								</fieldset>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">收货人</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入机构名称">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">联系方式</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入联系方式">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">邮政编码</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入邮政编码">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item" id="area-picker">
									<div class="layui-form-label">收货地址</div>
									<div class="layui-input-block">
										<div style="justify-content: space-between;display: flex;margin-bottom: 15px;">
											<div class="layui-input-inline">
												<select name="province" class="province-selector" lay-filter="province-1">
													<option value="">请选择省</option>
												</select>
											</div>
											<div class="layui-input-inline">
												<select name="city" class="city-selector" lay-filter="city-1">
													<option value="">请选择市</option>
												</select>
											</div>
											<div class="layui-input-inline">
												<select name="county" class="county-selector" lay-filter="county-1">
													<option value="">请选择区</option>
												</select>
											</div>
										</div>
										<div>
											<input type="text" class="layui-input" placeholder="请输入详细地址">
										</div>
									</div>
								</div>
							</div>
							<div class="site-title">
								<fieldset>
									<legend><a name="blockquote">店铺介绍</a></legend>
								</fieldset>
							</div>
							<div class="layui-col-sm4 layui-col-md4 layui-col-lg4 upload-box">
								<div class="layui-form-item">
									<i class="layui-icon layui-icon-picture"></i>
									上传店铺主图
									<i class="layui-icon layui-icon-camera-fill"></i>
								</div>
							</div>
							<div class="layui-col-sm4 layui-col-md4 layui-col-lg4 upload-box">
								<div class="layui-form-item">
									<i class="layui-icon layui-icon-picture"></i>
									上传微信二维码
									<i class="layui-icon layui-icon-camera-fill"></i>
								</div>
							</div>
							<div class="layui-col-sm4 layui-col-md4 layui-col-lg4 upload-box">
								<div class="layui-form-item">
									<div>
										<img src="../../layuiadmin/layui/images/u1208.jpg" style="width: 190px;">
									</div>
									<a href="avascript:void(0);">店铺介绍效果示例图</a>
								</div>
							</div>							
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">专家名字</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入专家名字">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">专家职称</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入专家职称">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">联系方式</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入联系方式">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">擅长项目</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入擅长项目">
									</div>
								</div>
							</div>
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div class="layui-form-item">
									<label class="layui-form-label">微信号</label>
									<div class="layui-input-block">
										<input type="text" class="layui-input" placeholder="请输入微信号">
									</div>
								</div>
							</div>
							<div class="layui-form-item">
								<div class="layui-input-block">
									<button class="layui-btn">保存</button>
									<div class="layui-btn layui-btn-primary cancel-btn">取消</div>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
		<!-- 完善与修改店铺信息end -->
		<script src="../../layuiadmin/layui/layui.js"></script>
		<script>
			layui.config({
				base: '../../layuiadmin/' //静态资源所在路径
			}).extend({
				index: 'lib/index' //主入口模块
			}).use(['index', 'form', 'element', 'table', 'laydate', 'layarea'], function() {
				var $ = layui.$,
					admin = layui.admin,
					element = layui.element,
					form = layui.form,
					table = layui.table,
					laydate = layui.laydate,
					layarea = layui.layarea;

				//所有会员表格实例
				table.render({
					elem: '#allMember',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					page: true //开启分页
						,
					limit: 5,
					cols: [
						[ //表头
							{
								type: 'checkbox',
							}, {
								field: 'username',
								title: '店铺信息',
								templet: '#webchatMsg'
							}, {
								field: 'sex',
								title: '店铺收货信息',
								templet: '#memberMsg'
							}, {
								field: 'city',
								title: '机构/合伙人',
								templet: '#registerMsg'
							}, {
								field: 'sign',
								title: '状态信息',
								templet: '#roleMsg'
							}, {
								title: '操作',
								width: 120,
								align: 'center',
								toolbar: '#memberMsgOperate'
							}
						]
					]
				});
				//日志表格实例
				table.render({
					elem: '#logTable',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					page: true //开启分页
						,
					cols: [
						[ //表头
							{
								type: 'numbers',
								title: '序号',
								width: 100
							}, {
								field: 'sex',
								title: '日志时间',
								width: 120
							}, {
								field: 'city',
								title: '操作人',
								width: 120
							}, {
								field: 'sign',
								title: '操作行为',
							}
						]
					]
				});

				//监听工具条
				table.on('tool(allMember)', function(obj) {
					var data = obj.data;
					console.log(data);
					switch (obj.event) {
						case 'log':
							// 日志
							layer.open({
								type: 1,
								title: '日志',
								area: '900px',
								shade: 0.8,
								id: 'LAY_log' //设定一个id，防止重复弹出
									,
								btnAlign: 'c',
								moveType: 1 //拖拽模式，0或者1
									,
								content: $("#log-box"),
								success: function(layero) {

								}
							});
							break;
						case 'effect':
							// 立即生效
							layer.confirm('是否立即生效此店铺？', {
								title: '温馨提示',
								icon: 3,
								btn: ['确定', '取消'] //按钮
							}, function(index) {
								// 确定
								layer.close(index);
							}, function() {
								// 取消
							});
							break;
						case 'stopUse':
							// 立即停用
							layer.confirm('是否立即停用此店铺？', {
								title: '温馨提示',
								icon: 3,
								btn: ['确定', '取消'] //按钮
							}, function(index) {
								// 确定
								layer.close(index);
							}, function() {
								// 取消
							});
							break;
						case 'edit':
							// 修改店铺信息
							layer.open({
								type: 1,
								title: '修改店铺信息',
								area: '800px',
								shade: 0.8,
								id: 'LAY_edit' //设定一个id，防止重复弹出
									,
								btnAlign: 'c',
								moveType: 1 //拖拽模式，0或者1
									,
								content: $("#edit-box"),
								success: function(layero) {

								}
							});
							break;
						case 'improve':
							// 完善店铺信息
							layer.open({
								type: 1,
								title: '完善店铺信息',
								area: '800px',
								shade: 0.8,
								id: 'LAY_edit' //设定一个id，防止重复弹出
									,
								btnAlign: 'c',
								moveType: 1 //拖拽模式，0或者1
									,
								content: $("#edit-box"),
								success: function(layero) {

								}
							});
							break;
					}
					// if(obj.event === 'detail'){
					//   layer.msg('ID：'+ data.id + ' 的查看操作');
					// } else if(obj.event === 'del'){
					//   layer.confirm('真的删除行么', function(index){
					//     obj.del();
					//     layer.close(index);
					//   });
					// } else if(obj.event === 'edit'){
					//   layer.alert('编辑行：<br>'+ JSON.stringify(data))
					// }
				});

				// 时间插件
				laydate.render({
					elem: '#test1'
				});

				layarea.render({
					elem: '#area-picker',
					change: function(res) {
						//选择结果
						console.log(res);
					}
				});
				
				// 取消按钮关闭弹窗
				$(".cancel-btn").on('click', function() {
					layer.close(layer.index)
				});

			});
		</script>
	</body>
</html>
